<template>
	<view class="content">
		<view class="line">
			<text class="leftBox">验证旧手机</text>
			<input type="text" placeholder="请输入手机号码" />
			<!-- 占位符 不要删 -->
			<text class="getCodes"></text>
		</view>
		<view class="line">
			<text class="leftBox">验证码</text>
			<input type="text" placeholder="请输入旧手机验证码" />

			<view class="getCode  getCodes">
				获取验证码
			</view>
		</view>
		<view class="line">
			<text class="leftBox">新手机</text>
			<input type="text" placeholder="请输入新手机号码" />
			<!-- 占位符 不要删 -->
			<text class="getCodes"></text>
		</view>
		<view class="sure-btn"> 确定 </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user: [],
				code: "",
			};
		},
		onShow() {
			var that = this;
			var value = uni.getStorageSync("poxer_ssid");
			/////////////////////////////////////
			var param = {
				uid: value
			};
			//////
			that._post("Users/index", param, function(res) {
				if (res.status != "1") {
					return;
				}
				that.user = res.data;
			});
		},
		methods: {
			/**
			 * 获取验证码
			 */
			getVeriCode() {
				var that = this;
				var param = {
					phone: that.user.phone
				};
				//////////
				if (that.getTimes != 120) {
					return;
				}
				that._post("Login/getSmsCode", param, function(res) {
					if (res.status != "1") {
						return;
					}
					that.code = res.data;
					that.inter = setInterval(function() {
						that.getTimes = that.getTimes - 1;
						that.getCode = that.getTimes;
						if (that.getTimes < 1) {
							that.getTimes = 120;
							that.getCode = "获取验证码";
							clearInterval(that.inter);
						}
					}, 1000);
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.content {
		background-color: #000000;
		width: 100vw;
		height: 100vh;
		box-sizing: border-box;

		.line {
			padding-left: 23rpx;
			padding-right: 23rpx;
			height: 90rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #ffffff;
			border-bottom: 3rpx solid #272727;

			.leftBox {
				width: 25%;

			}

			input {
				width: 40%;

			}


			.getCode {
				width: 160rpx;
				height: 56rpx;
				border: 2rpx solid #DB1414;
				border-radius: 10rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #DB1414;
			}

			.getCodes {
				width: 160rpx;

			}
		}

		.sure-btn {
			width: 710rpx;
			height: 88rpx;
			background: #db1414;
			border-radius: 10rpx;
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #ffffff;
			display: flex;
			justify-content: center;
			align-items: center;
			margin: 0 auto;
			margin-top: 125rpx;
		}
	}
</style>
